<template>
	<view class="text-26">
		<view>
			<view class="abnormalMain">
				<view class="flex-between abnormalItem">
					<view class="text-blue">产品类型</view>
					<view>{{hardwareData.arch}}</view>
				</view>
				<view class="flex-between abnormalItem">
					<view class="text-blue">系统版本</view>
					<view>{{hardwareData.osName}}</view>
				</view>
				<view class="flex-between abnormalItem">
					<view class="text-blue">CPU</view>
					<view>{{hardwareData.cputotalCores}}核</view>
				</view>
				<view class="flex-between abnormalItem">
					<view class="text-blue">内存</view>
					<view>{{(hardwareData.mem/1024/1024).toFixed(2)}} GB</view>
				</view>
				<view class="flex-between abnormalItem">
					<view class="text-blue">物理 CPU 主频</view>
					<view>{{hardwareData.cpufreq}}</view>
				</view>
				<view class="flex-between abnormalItem">
					<view class="text-blue">逻辑 CPU 主频</view>
					<view>{{hardwareData.cpulogic || '--'}}</view>
				</view>

			</view>

			<u-gap height="10" bg-color="#1F1757"></u-gap>

			<!-- table表格 -->

			<!-- 压测内容 -->
			<view class="flex" style="margin-top:20rpx;">
				<view class="xianYaHead ">
					<view class="text-blue ">
						<view>磁盘名</view>
					</view>
					<view class="yaCeValue flex-column-center">
						{{hardwareData.diskInfos.diskName || '--'}}
					</view>
				</view>
				<scroll-view class="scroll-view_H" scroll-x="true">
					<view class="zongYaCe  bg-blue">
						<view class="text-blue ">
							<view>类型</view>
						</view>
						<view class="yaCeValue flex-column-center">{{hardwareData.diskInfos[0].type || '--'}}</view>
					</view>
					<view class="zongYaCe  bg-blue">
						<view class="text-blue ">
							<view>大小</view>
						</view>
						<view v-if="!hardwareData.diskInfos[0].size" class="yaCeValue flex-column-center">
							{{hardwareData.diskInfos[0].size}}
						</view>
						<view v-else>{{(hardwareData.diskInfos[0].size/1024/1024/1024).toFixed(2)}}</view>
					</view>
					<view class="zongYaCe  bg-blue">
						<view class="text-blue ">
							<view>总磁盘利用率</view>
						</view>
						<view class="yaCeValue flex-column-center">{{hardwareData.diskInfos[0].usage}}</view>
					</view>
					<view class="zongYaCe  bg-blue">
						<view class="text-blue ">
							<view>写IOPS </view>
						</view>
						<view class="yaCeValue flex-column-center">{{hardwareData.diskInfos[0].wiops}}</view>
					</view>
					<view class="zongYaCe  bg-blue">
						<view class="text-blue ">
							<view>读IOPS </view>
						</view>
						<view class="yaCeValue flex-column-center">{{hardwareData.diskInfos[0].riops}}</view>
					</view>
					<view class="zongYaCe  bg-blue">
						<view class="text-blue ">
							<view>压测状态 </view>
						</view>
						<view class="yaCeValue flex-column-center">
							{{hardwareData.diskInfos[0].occupantStatus ? '使用中' : '未使用'}}
						</view>
					</view>

				</scroll-view>
			</view>

		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive,
		onMounted,
		inject,
		defineProps
	} from 'vue';

	import * as api from "@/utils/api.js"

	// 接收宽带信息
	const props = defineProps({
		nodeId: {
			type: String,
			default: "",
		}
	})


	let imageUrl = ref("");
	onMounted(() => {
		// 全局变量引入
		const globalData = inject('globalData');
		imageUrl.value = globalData.value.imgOssUrl;

		// 获取硬件信息
		getHardware();
	})

	// 硬件信息数据
	const hardwareData = ref();

	// 获取质量报告
	const getHardware = () => {
		let e = {
			url: "/app-api/device/node/hardware",
			data: {
				nodeId: props.nodeId ? props.nodeId : 'antd47b41f009dda857030050853fd1d'
			}
		}
		api.default.get(e).then((res) => {
			hardwareData.value = res.data;
		})
	}

	const columns = reactive([{
			title: '姓名',
			key: 'name'
		},
		{
			title: '年龄',
			key: 'age'
		},
		{
			title: '地址',
			key: 'address'
		}
	])
	const tableData = reactive([{
			name: '小明',
			age: 18,
			address: '北京市朝阳区'
		},
		{
			name: '小红',
			age: 20,
			address: '北京市海淀区'
		},
		{
			name: '小强',
			age: 22,
			address: '北京市昌平区'
		}
	])
</script>

<style scoped>
	.abnormalMain {
		/* border-bottom: 2rpx solid #1F1757; */
		margin: 20rpx 0;
	}

	.abnormalItem {
		margin-bottom: 20rpx;
	}

	.yiTips {
		padding: 30rpx 0;
		box-sizing: border-box;
	}

	.netHeight {
		line-height: 60rpx;
	}

	.networkKa {
		padding: 20rpx;
		box-shadow: inset 0rpx 0rpx 32rpx 14rpx rgba(43, 23, 147, 0.59);
		border-radius: 8rpx;
		margin: 20rpx 0 20rpx 0;
	}

	.copyIcon {
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}

	.diaoTitle {
		height: 100rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
	}



	.yaCeValue {
		height: 80rpx;
	}

	.yaHead {
		height: 80rpx;
	}

	.scroll-view_H {
		white-space: nowrap;
		width: 700rpx;
		overflow-x: auto;
		/* overflow-x: auto; */
	}

	.xianYaHead {
		min-width: 100rpx;
		padding: 10rpx 0;
		box-sizing: border-box;
		background-color: #292067;
		text-align: center;
	}

	.zongYaCe {
		/* 	width: 180rpx !important; */
		display: inline-block;
		padding: 10rpx 15rpx;
		box-sizing: border-box;
		text-align: center;
	}
</style>